<template>
    <div> 
      
  
  
  
      <el-form ref="form" :model="form" label-width="80px">
  
    <el-form-item label="提醒类别:">
      
  
      <el-radio-group v-model="checkboxGroup3" @input="test">
        <el-radio-button label="定时提醒" name="1"></el-radio-button>
        <el-radio-button label="周期提醒" name="2"></el-radio-button>
      </el-radio-group>
   
  
    </el-form-item> 
    <el-form-item label="提醒时间:">
       
      <el-date-picker  v-if="checkboxGroup3=='定时提醒'"
        v-model="form.value1"
        type="datetime"
        placeholder="选择日期时间">
      </el-date-picker>
  
  
      <div v-else>
        <el-select v-model="form.region" placeholder="请选择">
        <el-option label="每月" value="month"></el-option>
        <el-option label="每周" value="week"></el-option>
      </el-select>
     
  
      <el-checkbox-group v-model="form.type" v-if="form.region=='month'">
        <el-checkbox :label="e" name="type" v-for="(e,i) in list" :key="i"></el-checkbox> 
      </el-checkbox-group>
  
      <el-checkbox-group v-model="form.type" v-else>
        <el-checkbox :label="e" name="type" v-for="(e,i) in weekList" :key="i"></el-checkbox> 
      </el-checkbox-group>
  
      <el-time-picker
      v-model="form.value1"
      
      placeholder="请选择">
    </el-time-picker>
      </div>
     
  
    </el-form-item> 
    <el-form-item label="提醒方式:">
      <el-radio-group v-model="form.type">
      <el-radio :label="3">语音</el-radio>
      <el-radio :label="9">弹窗</el-radio>
      <el-radio :label="6">语音+弹窗</el-radio>
      <el-switch v-model="form.delivery"> </el-switch> 
      <el-link style="margin-left: 10px;">弹窗关闭</el-link>
    </el-radio-group>
    
  
    </el-form-item> 
    <el-form-item label="提醒内容:">
      <el-input type="textarea" v-model="form.desc"></el-input>
    </el-form-item>
    <el-form-item>
      <el-button type="primary" @click="onSubmit">立即创建</el-button>
      <el-button>取消</el-button>
    </el-form-item>
  </el-form>
  
  
    </div>
  </template>
  <script> 
  /*
  核心算法:
  
  定时任务去扫描
  当满足时间时 提示
  然后根据规则进行写入下次运行时间
  变动时，根据规则进行写入下次运行时间
  
  类型，内容，下次运行时间，是否开启,时间，roule,
  w,1,7
  m,1,,26,31
  
  function  getNextRunTime(e){
    var roules = e.roule.split(',')
    var day = new Date()
    var w = day.getDay()
    var m = d.getMonth();
    var d = day.getDate()
    var y = d.getFullYear()
    var day = '';
    if(roules[0] == 'm'){
      var tmp = roules.slice(1)
      var d = tmp.filter(e=>e>d)[0]
      day = d ? [y,m,d] : [y,m+1,tmp[0]] 
      if(!d && m == 11) day =  [y+1,0,tmp[0]]
      d = d || tmp[0]
    }else{
  
    }
    // 统一更简单的思路 就是 往后找 反正是找哪一天。
    var start = new Date(d.getFullYear(),d.getMonth(),1).getTime();
    for (let index = 0; index < array.length; index++) {
      var cur = new Date(start + i* 86400000)
      var cw = day.getDay()
      var cm = d.getMonth();
      var cd = day.getDate()
      if(tmp.indexOf(cd)||tmp.indexOf(cw)){  
        break
      }     
  
    }
    return new Date(day + '' + e.time)
  }
  */
  export default{
    data(){
      return {
        type: "定时提醒",
        checkboxGroup3: "定时提醒",
        activeName:'',
        list:Array(31).fill(1).map((e,i)=>i+1),
        weekList:["周日","周一","周二","周三","周四","周五","周六"],
        form:{
          region:'week',
        }
      }
    },
    methods: {
      test(val){
          console.log(val);
  
      },
    },
  }
  </script>